{% extends "base/base.html" %}

{% block title %}杨学峰博客 | {{ article.title }} {% endblock %}

{% block content %}
<div class="col-md-9">
  <div class="blog-post">
    <div class="blog-post-wrapper">
      <div class="blog-post__info  blog-post__info--top">
        <span><a href="{% url 'classfiDetail' classfi=article.classification %}">{{ article.classification }}</a></span>
      </div>
      <div class="blog-post__title">
        <h1><a href="single-post.html">{{ article.title }}</a></h1>
      </div>
      <div class="blog-post__info">
        <span>By <a href="#">{{ article.author }}</a></span>
        <span>{{ article.publish_time|date:'Y年m月d日' }}</span>
        <span><a href="#">{{ article.count }} Readers</a></span>
      </div>
    </div>
    <div class="blog-post-wrapper" style="margin-top:20px;">
      {{ article.content|safe }}
      <div class="blog-post__footer">
        <div class="blog-post__footer-tags">
          <h3>Tags:</h3>
          <div class="blog-post__footer-tags-list">
            {% for i in article.get_tags %}
              <a href="{{ i.get_absolute_url }}">{{i}}</a>
            {% endfor %}
          </div>
        </div>
      </div>

      <div class="blog-post__nav">
        {% if article.get_before_article %}
          {% with before=article.get_before_article %}
          <a class="blog-post__nav-previous" href="{{ before.get_absolute_url }}">
            <span class="blog-post__nav-next-link">Previous Post</span>
            <span>{{ before }}</span>
          </a>
          {% endwith %}
        {% endif %}
        {% if article.get_after_article %}
          {% with after=article.get_after_article %}
          <a class="blog-post__nav-next" href="{{ after.get_absolute_url }}">
            <span class="blog-post__nav-next-link">Next Post</span>
            <span>{{ after }}</span>
          </a>
          {% endwith %}
        {% endif %}
      </div>

      <!-- 打赏 -->
      <div id="reward">
        <button onclick="reward_modal_show()">打赏</button>
      </div>
      {% include "blog/reward.html" %}

      <div class="blog-post__comments"></div>
    </div>
  </div>
</div>
{% endblock %}

{% block js %}
  <script>
    function reward_modal_show(){
      $("#reward_modal").modal('show');
    }
  </script>
  <script src="/static/plugins/valine/valine.js"></script>
  <script>
    $('img').zoomify(); // Default settings
  </script>
{% endblock %}
